import React, {useState} from 'react';
import {View, TextInput, Text} from 'react-native';
import PropTypes from 'prop-types';

const ValueInput = ({label, unit, style, getRef, ...rest}) => {
  const passRef = ref => {
    if (getRef) {
      getRef(ref);
    }
  };

  return (
    <View
      style={[
        style,
        {
          flex: 1,
          alignItems: 'center',
          flexDirection: 'row',
          justifyContent: 'space-between',
        },
      ]}>
      <TextInput
        {...rest}
        style={{flex: 1, color: '#FFF', fontSize: 16}}
        placeholderTextColor={'#FFF'}
        maxLength={16}
        ref={passRef}
        // value={label}
      />
      <Text style={{color: '#B2B4BB', fontSize: 14}}>{unit}</Text>
    </View>
  );
};

ValueInput.defaultProps = {
  label: 'placeholder',
  unit: '',
};

ValueInput.propTypes = {
  label: PropTypes.string,
  unit: PropTypes.string,
};

export default ValueInput;
